var colors = "191923-0e79b2-bf1363-f39237-ff0000-00ff00-0000ff".split("-").map(a=>"#"+a)
let overAllTexture
function setup() {
	createCanvas(800,800);
	background(100);
	
	xx=width/2
	
	// drawingContext.shadowColor = color(255,0,0,30);
	// drawingContext.shadowBlur =30;
	
	overAllTexture=createGraphics(width,height)
	overAllTexture.loadPixels()
	for(var i=0;i<width;i++){
		for(var o=0;o<height;o++){
			overAllTexture.set(i,o,color(100,noise(i/3,o/3,i*o/50)*random([0,30,60])))
		}
	}
	overAllTexture.updatePixels()
}

function anemone(xx,rid,clr,thickness=1,length=1){
	
	
	blendMode(SCREEN)
	beginShape()
	strokeWeight(noise(rid,5000,frameCount/1000)*100*thickness)
	let hh = noise(xx,rid,1000+frameCount/100)*height*0.6 + random(2)
	stroke(clr)
	
	let lastX,lastY
	for(var i=0;i<hh;i+=2){
		let deltaFactor = map(i,0,100,0,1,true)
		let mouseFactor = map(i,0,400,0,1)*log(hh)/10
		let mouseDirectionFactor = noise(frameCount/50)-0.5
		let mouseDelta = map(mouseX,0,width,-500,500)*mouseDirectionFactor
		
		let deltaX = deltaFactor* (noise(i/300,frameCount/100+mouseY/100,rid)-0.5)*350
		lastX=xx+deltaX+mouseDelta*mouseFactor
		lastY=-i*2*length
		
		let ratio = map(log(i),0,noise(frameCount/100,mouseY/100)*10+5,0,1,true)
		curveVertex(lerp(width/2,lastX,ratio),lastY)
		
	}
	endShape()
	if (thickness!=1 && noise(frameCount/1000,rid)<0.8){
		ellipse(lastX,lastY-10,6,6)
	}
		
}
function draw() {
	push()
		fill(0)
		noStroke()
		blendMode(BLEND)
		rect(0,0,width,height)
	pop()
	push()
		translate(0,height)
		stroke(255)
		blendMode(BLEND)
		// background(0)
		noFill()
		let clrs = colors
		blendMode(SCREEN)
	
		for(var i=0;i<10;i++){

			clrs.forEach((clr,clrId)=>{
				let useColor = color(clr)
				useColor.setAlpha(200 + noise(frameCount/100,i)*10)
				anemone(i*100 ,i*2+clrId/2,useColor)
			})

		}
	
		for(var i=0;i<=4;i++){
			clrs.forEach((clr,clrId)=>{
				anemone(i*200,i*2+clrId+50,clr,0.05,1.2)
			})

		}
	pop()
	
	push()
		blendMode(MULTIPLY)
		image(overAllTexture,0,0)
	pop()
	// ellipse(mouseX, mouseY, 20, 20);
}